<div id="<?php echo $uniqid;?>" method="post" style="padding: 8px;">
    <table border="0" width="100%" cellspacing="1" cellpadding="5" class="formtable">
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >门店名称：</td>
            <td width="80%">{{info.name}}</td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td class="tlabel" >门店图片：</td>
            <td style="padding-top: 5px; padding-bottom: 5px;">
                <div style="display: flex;align-items: center;">
                    <template v-for="(image, i) in info.images_arr">
                        <img :src="image" style="width: 60px; height: 60px; border-radius: 5px; margin-right: 3px;" />
                    </template>
                </div>
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >联系人：</td>
            <td width="80%">{{info.realname}}</td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >联系电话：</td>
            <td width="80%">{{info.phone}}</td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >所在区域：</td>
            <td width="80%">
                {{info.province_name}}-{{info.city_name}}-{{info.area_name}}
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >详细地址：</td>
            <td width="80%">{{info.address}}</td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >营业时间：</td>
            <td width="80%">
                <p style="line-height: 1.8em;">{{info.openweeks_text}}<br/>{{info.openhours_text}}</p>
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >申请状态：</td>
            <td width="80%">
                <p style="line-height: 1.8em;" :class="'status_color_'+info.status">
                    <span style="display: block;">{{info.status_text}}</span>
                    <span style="display: block;" v-if="info.status != 0">{{info.status>0?'同意':'拒绝'}}时间：{{info.updated_at}}</span>
                    <span style="display: block;" v-if="info.status == '-1'">
                        拒绝理由：{{info.reason}}
                    </span>
                </p>
                <p v-if="info.status == 0">
                    <span class="l-btn l-btn-small l-btn-left color9 table" style="background-color: #09c002; color: #FFFFFF;" @click="applyAgree"><span class="l-btn-text">同意</span></span>
                    <span class="l-btn l-btn-small l-btn-left color9 table" style="background-color: #d10101; color: #FFFFFF;" @click="applyRefuse"><span class="l-btn-text">拒绝</span></span>
                </p>
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >申请用户：</td>
            <td width="80%" style="padding-top:5px; padding-bottom: 5px;">
                <div style="display: flex;align-items: center;" v-if="info.member">
                    <img :src="info.member.avatar" style="height:40px;width:40px; border-radius: 50%; border:1px solid #e6e6e6; margin-right: 3px;" v-if="info.member.avatar"/>
                    <img src="/images/base_avatar.png" style="height:40px;width:40px; border-radius: 50%; border:1px solid #e6e6e6; margin-right: 3px;" v-else />
                    <p style="line-height: 1.8em;">昵称：{{info.member.nickname}}<br/>手机号：{{info.member.phone}}</p>
                </div>
                <p v-else>非正式用户</p>
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td  class="tlabel" >申请时间：</td>
            <td width="80%">
                {{info.created_at}}
            </td>
        </tr>
    </table>
</div>

<script>
    var storeApplyInfoVm = new Vue({
        el: '#<?php echo $uniqid;?>',
        data: {
            id: '<?php echo addslashes($id);?>',
            info:{},
        },
        mounted(){
            this.init();
        },
        methods: {
            init(){
                let that = this;
                $.post('/admin/storeapply/info', {'id': this.id}, function(res){
                    if(res.ret===0){
                        that.info = res.data;
                    }else{
                        $("#storeapplydlg").dialog('close');
                        $.messager.alert('提示',res.msg,'warning');
                    }
                });
            },
            applyAgree: function (){
                storeapplyVm.applyAgree(storeApplyInfoVm.id, true);
            },
            applyRefuse: function (){
                storeapplyVm.applyRefuse(storeApplyInfoVm.id, true);
            },
        }
    });
</script>
<style>
    .status_color_0{
        color: #f89a2d;
    }
    .status_color_1{
        color: #0eb913;
    }
    .status_color_-1{
        color: #d33632;
    }
</style>
